<template>
    <div>
        <input type="text" v-model="this.title"><button @click="add">提交</button>
    </div>
</template>

<script>
    export default {
        name:'inp',
        props:{
            
        },
        data() {
            return {
              title:'',
            }
        },
        mounted() {
            
        },
        methods: {
            add(){
                this.$emit('add',this.title);
                this.title=''
            }
        }
    }
</script>

<style lang="scss" scoped>
input{
    width:250px;
    height: 30px;
    border: 0;
    outline: none;
    font-size: 25px;
    border-bottom: 3px dashed #fe7345;
    background: #f2f2f2;
}
button{
    width: 50px;
    height: 30px;
    border: 0;
    background: #fe7345;
    margin-left: 10px;
    border-radius: 5px;
    color: white;
}
</style>